<?php 
if (!empty($dataItemInfo)){
	$arrName = array();
	foreach ($dataItemInfo as $dataItemInfo){
		$arrName[$dataItemInfo['Area']['id']] = $dataItemInfo['Area']['name'];
	}
//	debug($arrName);
}?>
<div style = "width: 450px">	
	<div class="modal-header " align ="center" style = "color: green">
	    <h3>Link</h3>
 	 </div>
 	 <br>
	<?php echo $this->Form->create('Link', array('class' => "form-horizontal",'id' => 'myform', 'url' => array('controller' => 'management', 'action' => 'add_items')));?>
	<div align ="center">
		<table>
			<tr>
				<td>Area Name</td>
				<td><?php echo $this->Form->select('area_id', array(isset($arrName)?$arrName:null), array('class' => 'selectAreaName')); ?> </td>
				<td></td>
			</tr>
				<?php echo $this->Form->input('screen_id', array('label' => false, 'type' => 'hidden', 'value' => isset($idScreen)?$idScreen:null));?>
			<tr>
				<td>Item Name(Vi)</td>
				<td><?php echo $this->Form->input('item_name', array('label' => false));?></td>
				<td></td>
			</tr>
			<tr>
				<td>Value</td>
				<td><?php echo $this->Form->input('value', array('label' => false ));?></td>
				<td><?php echo $this->Form->checkbox('unclearValue', array('label' => false))."Unclear";?></td>
			</tr>
			<tr>
				<td>Transition</td>
				<td><?php echo $this->Form->textarea('transition', array('label' => false, 'rows' => '5'));?></td>
				<td><?php echo $this->Form->checkbox('unclearTransition', array('label' => false ))."Unclear";?></td>
			</tr>
			<tr>
				<td>Permission</td>
				<td><?php echo $this->Form->select('permission', array(), array('class' => 'selectPermission')); ?> </td>
				<td><?php echo $this->Form->checkbox('unclearPermission', array('label' => false ))."Unclear";?></td>
			</tr>
		</table>
	</div>
	  <div class="modal-footer" >
	     <div align = "center">
	     <button type="submit" class="btn btn-primary">Save</button>
	     </div> 
	  </div>
	  
	<?php echo $this->Form->end();?>
	
</div>
<script type="text/javascript">
$( "#myform" ).validate({
	  rules: {
		"data[Link][area_id]": {
		 	required: true
		 },
		"data[Link][item_name]": {
			required: true
		},
		"data[Link][value]": {
			required: true
		},
		"data[Link][transition]": {
			required: true
		},
	  }
	});
$(".selectAreaName").select2({
    placeholder: "Selection...",
    
});
$(".selectPermission").select2({
    placeholder: "Selection...",
    
});
</script>